<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script>
      window.onload = function () {
        console.log("dom加载结束后执行");
        var ele = document.querySelector("box");
        console.log(ele);
      };
      console.log(111);
    </script>
  </head>
  <body>
    <div class="box">111</div>
    <script>
      //1.html标签的简写形式: document.documentElement
      //
      //普通写法
      var htmlEle = document.querySelector("html");
      console.log(htmlEle);

      //简写形式
      console.log(document.documentElement);

      //2.head标签 :document.head

      //普通写法
      var headEle = document.querySelector("head");
      console.log(headEle);

      //简写
      console.log(document.head);

      //3.body标签: document.body

      //普通写法
      var bodyEle = document.querySelector("body");
      console.log(bodyEle);

      //简写
      console.log(document.body);

      //4.获取title标签里面的内容
      //获取title标签里面的文本,可以设置title标签里的文本
      var titleEle = document.querySelector("title");
      console.log(titleEle);
      titleEle.innerText = "修改了";
      console.log(document.title);
      document.title = "标题"; //覆盖

      var num = 0;
      setInterval(function () {
        console.log(111);
        num++;
        document.title = num;
      }, 1000);
    </script>
  </body>
</html>
